<template>
  <el-form
    ref="userForm"
    :model="userInfo"
    label-width="120px"
    style="margin-left: 120px; margin-top: 30px"
  >
    
    <el-form-item label="姓名:">
     <el-input v-model="userInfo.username" style="width: 300px" /> 
    </el-form-item>

    <el-form-item label="密码:">
      <el-input
        v-model="userInfo.password"
        type="password"
        disabled
        style="width: 300px"
      />
      
    </el-form-item>

    
    <el-form-item>
      <el-button type="primary" @click="submit">更新</el-button> 
    </el-form-item>
  
  </el-form>
</template>
  <script>
import { getuserhead } from "@/api/user";
import { saveUserDetailById } from '@/api/employees'

export default {
  props: {
    // id: {
    //   type: String,
    //   required: true,
    // },
  },
  data() {
    return {
      id:this.$route.params.id,
      userInfo: {
        username: "",
        password: "",
      },
    };
    
  },
  created() {
    this.loadDetailById();
  },
  methods: {
    // 获取数据信息
    async loadDetailById() {
      try {
        const res = await getuserhead(this.id);
        console.log("getuserhead", res); // 保存数据
        this.userInfo = res.data;
      } catch (err) {
        console.log("getuserhead", err);
      }
    },
    // 点击更新,触发修改函数
    submit(){
     this.xiuUserDetailById()
    },
   // 修改数据信息
    async xiuUserDetailById(){
      try {
        const res = await saveUserDetailById(this.userInfo)
        this.$message.success(res.message)
        this.$router.back()
      } catch (err) {
        console.log('saveUserDetailById', err)
      }
    },
  },
  
};
</script>